<template>
  <div>
    <h1>关于</h1>
    <p>这是关于页面！</p>
    <a-button type="primary" @click="getLogin">登录</a-button>
    <HelloWorld  ref="helloWorld1" @click="callChildMethod"/>
    <HelloWorld  ref="helloWorld2"
                 @click="callChildMethod"
                 @changeName="changeName"
                 :message="message"
    />
  </div>
</template>

<script setup>
import HelloWorld from "./components/HelloWorld.vue";
import { ref } from "vue";
import {loginAPI} from '@/api/login'
const getLogin = async () => {
  const res = await loginAPI()
  console.log(res.data.message)
}


const helloWorld1 = ref(null);
const helloWorld2 = ref(null);
const callChildMethod = () => {
  helloWorld1.value.setName('wang');
  console.log(helloWorld2.value.getName());
}

const message = ref("哦耶！哦耶！哦耶！");
const changeName = () => {
  message.value = "赚钱发大财！";
}

</script>

<style>
</style>
